<style scoped>
    .img-face {
        max-width: 200px;
        max-height: 200px;
        padding: 10px;
        cursor: pointer;
    }
</style>
<template>
    <div>
        <Card style="margin-bottom: 10px">
            <Form inline class="form-search">
                <FormItem>
                    <DatePicker style="width: 150px" type="date" format="yyyy年MM月dd日" placeholder="开始日期" :clearable="false" v-model="sdate"></DatePicker>
                </FormItem>
                <FormItem>
                    <DatePicker style="width: 150px" type="date" format="yyyy年MM月dd日" placeholder="结束日期" :clearable="false" v-model="edate"></DatePicker>
                </FormItem>
                <FormItem> </FormItem>
                <FormItem>
                    <Input v-model="keyword" placeholder="客户名称/商品" style="width: 200px" />
                </FormItem>

                <FormItem>
                    <Button type="primary" @click="
  page = 1;
SearchPurchaseOrderBack();
          " icon="md-search">查询</Button>
                </FormItem>
                <FormItem>
                    <Button type="primary" @click="AddData()" icon="md-add">新增</Button>
                </FormItem>
            </Form>
        </Card>
        <Table ref="table" style="margin-bottom: 10px" border show-summary :summary-method="handleSummary" :loading="loadingTable" :columns="tableTitle" :data="tableData" :height="tableHeight"></Table>
        <Page :total="total" :current="page" :page-size="size" :page-size-opts="[10, 50, 100]" @on-change="
        (s) => {
          page = s;
          SearchPurchaseOrderBack();
        }
      " @on-page-size-change="
  (p) => {
    size = p;
    page = 1;
    SearchPurchaseOrderBack();
  }
" show-total show-sizer />
        <Modal width="1200" :footer-hide="true" v-model="modalData" :title="modalTitle" :mask-closable="false" sticky draggable>
            <purchaseorderbackedit v-if="modalData" :Id="tempDataId" :Type="tempType" @on-success="onSuccess"></purchaseorderbackedit>
        </Modal>

        <iframe id="iframe-print" frameborder="0" style="display: none" scrolling="auto" :src="printSrc"></iframe>
    </div>
</template>

<script>
    import {
        SearchPurchaseOrderBack,
        GetPurchaseOrderBackAndPrint,
        DeletePurchaseOrderBack,
        CheckPurchaseOrderBack
    } from '@/api/purchaseorderback'
    import purchaseorderbackedit from './purchaseorderbackedit.vue'
    export default {
        name: 'purchaseorderback',
        components: { purchaseorderbackedit },
        data() {
            return {
                Extras: {},
                printSrc: '/static/print/purchaseorderback.html?temp=' + Date.parse(new Date()),
                total: 0,
                page: 1,
                size: 50,
                tableHeight: 450,
                sdate: '',
                edate: '',
                keyword: '',
                ruleValidate: {},
                loading: false,
                loadingTable: false,
                tempDataId: 0,
                tempType: 0,
                isPrint: 0,
                modalData: false,
                tableTitle: [
                    {
                        type: 'index',
                        key: 'index',
                        title: '序号',
                        align: 'center',
                        width: 100,
                        render: (h, params) => {
                            return h('span', params.index + (this.page - 1) * this.size + 1)
                        }
                    },
                    {
                        title: '操作',
                        align: 'center',
                        width: 220,
                        render: (h, params) => {
                            var operateArr = []
                            operateArr.push(h('Button', {
                                props: {
                                    type: 'success',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.CheckPurchaseOrderBack(params.row.Id, params.row.Status == 1 ? 0 : 1)
                                    }
                                }
                            }, params.row.Status == 1 ? '弃审' : '审核'))
                            operateArr.push(h('Button', {
                                props: {
                                    type: 'warning',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.GetPurchaseOrderBackAndPrint(params.row.Id)
                                    }
                                }
                            }, '打印'))
                            if (params.row.Status == 0) {
                                operateArr.push(h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            var vm = this
                                            vm.tempType = 0
                                            vm.tempDataId = params.row.Id
                                            vm.modalData = true
                                        }
                                    }
                                }, '修改'))
                                operateArr.push(h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.DeletePurchaseOrderBack(params.row.Id)
                                        }
                                    }
                                }, '删除'))
                            }
                            return h('div', operateArr)
                        }
                    },
                    {
                        key: 'PurchaseOrderBackDate',
                        title: '单据日期',
                        width: 120,
                        align: 'center',
                        render: (h, params) => {
                            return h('span', {}, this.dayjs(params.row.PurchaseOrderBackDate).format('YYYY-MM-DD'))
                        }
                    },
                    {
                        key: 'OrderNo',
                        title: '单据编号',
                        width: 180,
                        align: 'center',
                        render: (h, params) => {
                            return h(
                                'a',
                                {
                                    style: {
                                        fontSize: '16px',
                                        textDecoration: 'underline'
                                    },
                                    on: {
                                        click: () => {
                                            let vm = this
                                            vm.tempDataId = params.row.Id
                                            vm.tempType = 1
                                            vm.modalData = true
                                        }
                                    }
                                },
                                params.row.OrderNo
                            )
                        }
                    },
                    {
                        key: 'CustomerName',
                        title: '供应商名称',
                        width: 100,
                        align: 'center'
                    },

                    {
                        key: 'OrderDesc',
                        title: '商品',
                        width: 200,
                        align: 'center'
                    },
                    {
                        key: 'Amount',
                        title: '合计(元)',
                        width: 120,
                        align: 'center'
                    },

                    {
                        key: 'GiveupFee',
                        title: '扣减金额(元)',
                        width: 120,
                        align: 'center'
                    },
                    {
                        key: 'AllFee',
                        title: '累计金额(元)',
                        width: 120,
                        align: 'center'
                    },
                    {
                        key: 'PayFee',
                        title: '实退金额(元)',
                        width: 120,
                        align: 'center'
                    },
                    {
                        key: 'PrintNum',
                        title: '打印次数',
                        width: 100,
                        align: 'center'
                    },
                    {
                        key: 'Remark',
                        title: '备注',
                        width: 200,
                        align: 'center'
                    }
                ],
                tableData: [],
                allRoles: [],
                tempRoleIds: [],
                checkAll: false,
                tempDetail: [],
                modalChose: false,
                configData: {},
                dataProduct: []
            }
        },
        computed: {
            modalTitle() {
                if (this.tempType == 1) {
                    return '采购退货单详情'
                } else {
                    if (this.tempDataId > 0) {
                        return '修改采购退货单'
                    } else {
                        return '新增采购退货单'
                    }
                }
            }
        },
        methods: {
            onSuccess(res) {
                this.modalData = false
                if (res == 1) {
                    this.SearchPurchaseOrderBack()
                }
            },
            handleSummary({ columns, data }) {
                let vm = this
                const sums = {}
                columns.forEach((column, index) => {
                    const key = column.key
                    if (index === 0) {
                        sums[key] = {
                            key,
                            value: '合计'
                        }
                    } else if (key == 'Amount') {
                        sums[key] = {
                            key,
                            value: Number(vm.Extras.Amount.toFixed(2))
                        }
                    } else if (key == 'FreightFee') {
                        sums[key] = {
                            key,
                            value: Number(vm.Extras.FreightFee.toFixed(2))
                        }
                    } else if (key == 'GiveupFee') {
                        sums[key] = {
                            key,
                            value: Number(vm.Extras.GiveupFee.toFixed(2))
                        }
                    } else if (key == 'AllFee') {
                        sums[key] = {
                            key,
                            value: Number(vm.Extras.AllFee.toFixed(2))
                        }
                    } else if (key == 'PayFee') {
                        sums[key] = {
                            key,
                            value: Number(vm.Extras.PayFee.toFixed(2))
                        }
                    } else {
                        sums[key] = {
                            key,
                            value: ' '
                        }
                    }
                })
                return sums
            },
            SearchPurchaseOrderBack() {
                let vm = this
                vm.loadingTable = true
                if (typeof vm.sdate === 'object') {
                    vm.sdate = vm.dayjs(vm.sdate).format('YYYY年MM月DD日')
                }
                if (typeof vm.edate === 'object') {
                    vm.edate = vm.dayjs(vm.edate).format('YYYY年MM月DD日')
                }
                var reqData = {
                    page: vm.page,
                    size: vm.size,
                    sdate: vm.sdate,
                    edate: vm.edate,
                    keyword: vm.keyword
                }
                SearchPurchaseOrderBack(reqData).then((res) => {
                    vm.loadingTable = false
                    var data = res.data
                    if (data.StatusCode == 200) {
                        vm.tableData = data.Data.Items
                        vm.total = data.Data.TotalCount
                        vm.Extras = data.Extras
                    } else {
                        vm.$Notice.error({
                            title: data.Errors
                        })
                    }
                })
            },
            GetPurchaseOrderBackAndPrint(id) {
                GetPurchaseOrderBackAndPrint(id).then((res) => {
                    const data = res.data
                    if (data.StatusCode == 200) {
                        document
                            .getElementById('iframe-print')
                            .contentWindow.printData(data.Data)
                    } else {
                        this.$Message.error({ title: '提示', content: data.Errors })
                    }
                })
            },
            DeletePurchaseOrderBack(id) {
                this.$Modal.confirm({
                    title: '提示',
                    content: '确定要删除吗？',
                    onOk: () => {
                        DeletePurchaseOrderBack(id).then((res) => {
                            const data = res.data
                            if (data.StatusCode == 200) {
                                this.SearchPurchaseOrderBack()
                                this.$Message.success({ title: '提示', content: '删除成功' })
                            } else {
                                this.$Message.error({ title: '提示', content: data.Errors })
                            }
                        })
                    },
                    onCancel: () => { }
                })
            },
            CheckPurchaseOrderBack(id, status) {
                var content = '确定要弃审吗？'
                if (status == 1) {
                    content = '审核后数据不允许修改，确定要审核吗？'
                }
                this.$Modal.confirm({
                    title: '提示',
                    content: content,
                    onOk: () => {
                        var reqData = {
                            Id: id,
                            Status: status
                        }
                        CheckPurchaseOrderBack(reqData).then((res) => {
                            const data = res.data
                            if (data.StatusCode == 200) {
                                this.SearchPurchaseOrderBack()
                                this.$Message.success({ title: '提示', content: '操作成功' })
                            } else {
                                this.$Message.error({ title: '提示', content: data.Errors })
                            }
                        })
                    },
                    onCancel: () => { }
                })
            },
            AddData() {
                this.tempDataId = 0
                this.tempType = 0
                this.modalData = true
            }
        },
        mounted() {
            this.tableHeight = window.innerHeight - 300
            this.sdate = this.dayjs().subtract(1, 'month').date(1).format('YYYY年MM月DD日')
            this.edate = this.dayjs().format('YYYY年MM月DD日')
            this.SearchPurchaseOrderBack()
        }

    }
</script>

<style>
</style>
